<template>
  <div id="app">
    <div class="tabs">
      <TabLeft :tabs="tabs" :currentIndex="currentIndex" @deliverIndex="changelist" />
      
      <TabRight :tabs="tabs"  :currentIndex="currentIndex" />
    </div>
  </div>

</template>

<script>
import TabLeft from './components/TabLeft.vue';
import TabRight from './components/TabRight.vue';

export default {
  data(){
    return {
      currentIndex:0, 
      tabs:[
        {  
          tabName:'热销',
          goods:[
            {pic:"http://t13.baidu.com/it/u=2767523262,1643431125&fm=224&app=112&f=JPEG?w=500&h=500",name:'挪威三文鱼刺身',infor:'取于三文鱼中段，口感鲜嫩',count:40,price:45},
            {pic:"https://img1.baidu.com/it/u=1721724179,2183408797&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1665853200&t=912097383086af16b60adc1d323c988d",name:'国产生蚝',infor:'取于三文鱼中段，口感鲜嫩',count:37,price:48},
            {pic:"https://img2.baidu.com/it/u=837447211,2688424829&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1665853200&t=f773f0d1f5d4659be55ca47b387a3a60",name:'北极甜虾',infor:'口感鲜嫩',count:62,price:40},
        ]
        },
        {  
          tabName:'优惠',
          goods:[
            {pic:"https://img1.baidu.com/it/u=1721724179,2183408797&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1665853200&t=912097383086af16b60adc1d323c988d",name:'挪威三文鱼刺身',infor:'取于三文鱼中段，口感鲜嫩',count:40,price:45},
            {pic:"http://t13.baidu.com/it/u=2767523262,1643431125&fm=224&app=112&f=JPEG?w=500&h=500",name:'三文鱼',infor:'取于三文鱼中段，口感鲜嫩',count:37,price:48},
            {pic:"https://img1.baidu.com/it/u=1220963408,2366481093&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=500",name:'国产生蚝',infor:'口感鲜嫩',count:62,price:40},
        ]
        },
        {  
          tabName:'三文鱼',
          goods:[
            {pic:"https://img1.baidu.com/it/u=1721724179,2183408797&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1665853200&t=912097383086af16b60adc1d323c988d",name:'挪威三文鱼刺身',infor:'取于三文鱼中段，口感鲜嫩',count:40,price:45},
            {pic:"https://img2.baidu.com/it/u=837447211,2688424829&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1665853200&t=f773f0d1f5d4659be55ca47b387a3a60",name:'国产生蚝',infor:'取于三文鱼中段，口感鲜嫩',count:37,price:48},
            {pic:"http://t13.baidu.com/it/u=2767523262,1643431125&fm=224&app=112&f=JPEG?w=500&h=500",name:'三文鱼刺身',infor:'口感鲜嫩',count:62,price:40},
        ]
        },
        {  
          tabName:'刺身',
          goods:[
            {pic:"https://img2.baidu.com/it/u=837447211,2688424829&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1665853200&t=f773f0d1f5d4659be55ca47b387a3a60",name:'挪威三文鱼刺身',infor:'取于三文鱼中段，口感鲜嫩',count:40,price:45},
            {pic:"https://img1.baidu.com/it/u=1220963408,2366481093&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=500",name:'三文鱼',infor:'取于三文鱼中段，口感鲜嫩',count:37,price:48},
            {pic:"https://img2.baidu.com/it/u=837447211,2688424829&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1665853200&t=f773f0d1f5d4659be55ca47b387a3a60",name:'三文鱼刺身',infor:'口感鲜嫩',count:62,price:40},
        ]
        },
        {  
          tabName:'年货礼品区',
          goods:[
            {pic:"https://img1.baidu.com/it/u=1220963408,2366481093&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=500",name:'挪威三文鱼刺身',infor:'取于三文鱼中段，口感鲜嫩',count:40,price:45},
            {pic:"http://t13.baidu.com/it/u=2767523262,1643431125&fm=224&app=112&f=JPEG?w=500&h=500",name:'三文鱼',infor:'取于三文鱼中段，口感鲜嫩',count:37,price:48},
            {pic:"http://t13.baidu.com/it/u=2767523262,1643431125&fm=224&app=112&f=JPEG?w=500&h=500",name:'三文鱼刺身',infor:'口感鲜嫩',count:62,price:40},
        ]
        },
        {  
          tabName:'野生大对虾',
          goods:[
            {pic:"https://img1.baidu.com/it/u=1721724179,2183408797&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1665853200&t=912097383086af16b60adc1d323c988d",name:'挪威三文鱼刺身',infor:'取于三文鱼中段，口感鲜嫩',count:40,price:45},
            {pic:"https://img1.baidu.com/it/u=1220963408,2366481093&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=500",name:'三文鱼',infor:'取于三文鱼中段，口感鲜嫩',count:37,price:48},
            {pic:"https://img1.baidu.com/it/u=1721724179,2183408797&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1665853200&t=912097383086af16b60adc1d323c988d",name:'三文鱼刺身',infor:'口感鲜嫩',count:62,price:40},
        ]
        }, 
      ]
    }
  },
  components:{
    TabLeft,
    TabRight
  },
  methods:{
    changelist(index){
      this.currentIndex = index;
    }
  }
}
</script>

<style lang="scss">
.tabs{
  display: flex;
}
</style>